<template>
	<view class="container">
		<map id="myMap" :markers="markers" style="width:100%;height:100%;" :longitude="longitude" :latitude="latitude"
			:scale="scale">
		</map>
	</view>
</template>

<script>
	// 引入SDK核心类
	import QQMapWX from "@/common/qqmap-wx-jssdk.js";

	export default {
		data() {
			return {
				markers: [],			
				longitude: 114.200435,
				latitude: 30.646388,
				scale: 18
			};
		},
		onLoad() {
			// 实例化API核心类
			const qqmapsdk = new QQMapWX({
				key: 'ZGWBZ-RU475-RRPIC-ILOW4-6COQ6-U7BIQ' // 必填
			});
			// 这里可以添加使用 qqmapsdk 的逻辑，比如获取位置信息等
			// 示例：获取当前位置信息
			qqmapsdk.reverseGeocoder({
				success: function(res) {
					console.log(res);
				},
				fail: function(error) {
					console.error(error);
				},
				complete: function(res) {
					console.log(res);
				}
			});
		}
	};
</script>

<style scoped>
	.container {
		width: 100%;
		height: 100vh;
	}
</style>